<template>
	<view class="main">
		<view class="title_head">
			<view class="title No">行号</view>
			<view class="title code">条码</view>
			<view class="title name">产品名称</view>
		</view>
		<view class="item" v-for="(item, index) in goodList" :key="index" @click="selecItem(item)" >
			<view class="item No">{{ index + 1 }}</view>
			<view class="item code">{{ item.barcode[0] }}</view>
			<view class="item name" >{{ item.goodName[0].goodName }}</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'selectForm',
	props: {
		goodList: {
			type: Array,
			default: () => []
		}
	},
	data() {
		return {};
	},
	methods: {
		selecItem(item) {
			this.$emit('selectItem', item);
		}
	}
};
</script>

<style lang="scss" scoped>

.main {
	position: absolute;
	bottom: -200rpx;
	left: 0;
	width: 800rpx; /* 与父元素同宽 */
	z-index: 99; /* 确保层级足够高 */
	background-color: #eeeeee;
	border-radius: 4rpx;
}
.title_head {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 40rpx;
	border-top-right-radius: 30rpx;
	border-top-left-radius: 30rpx;
	padding: 10rpx 20rpx;
}
.title {
	display: flex;
	justify-content: center;
}
.item {
	display: flex;
	justify-content: center;
	height: 60rpx;
	background-color: white;
	padding: 10rpx 20rpx;
}
.No {
	width: 20%;
}
.code {
	width: 40%;
}
.name {
	width: 50%;
}
</style>
